<template>
  <div class="body">
    <div class="ChineseName">
      <span class="Name">中文姓名</span>
      <span class="name_title">{{userInfo.name}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">英文姓名</span>
      <span class="name_title">{{userInfo.en_name}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">性别</span>
      <span class="name_title">
        <a v-if="userInfo.gender==1">男</a>
        <a v-if="userInfo.gender==2">女</a>
        <a v-if="userInfo.gender==0">未知</a>
      </span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">是否为永久居民</span>
      <span class="name_title">
        <a v-if="userInfo.ispr==1">是</a>
        <a v-if="userInfo.ispr==0">不是</a>
      </span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">生日</span>
      <span class="name_title">{{userInfo.birth}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">手机号</span>
      <span class="name_title">{{userInfo.phone}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">电邮</span>
      <span class="name_title">{{userInfo.email}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">身份证号</span>
      <span class="name_title">{{userInfo.id_number}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">住宅资料</span>
      <span class="name_title">{{userInfo.address}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">公司名称</span>
      <span class="name_title">{{userInfo.company}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">公司职务</span>
      <span class="name_title">{{userInfo.vocation}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">备用电邮</span>
      <span class="name_title">{{userInfo.ready_email}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">个人爱好</span>
      <span class="name_title">{{userInfo.interest}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">微信号</span>
      <span class="name_title">{{userInfo.wxid}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">个人特长</span>
      <span class="name_title">{{userInfo.speciality}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">学历</span>
      <span class="name_title">{{userInfo.education}}</span>
    </div>
    <div class="gray"></div>
    <div class="ChineseName">
      <span class="Name">社会职务</span>
      <span class="name_title">{{userInfo.social_vocation}}</span>
    </div>
  </div>
</template>

<script>
import { getSocietyUser } from '@/api/society'
export default {
  name: 'User',
  data () {
    return {
      userInfo: []
    }
  },
  created () {
    this.loadData()
  },
  methods: {
    loadData () {
      getSocietyUser({
        sid: this.$route.query.sid,
        uid: this.$route.query.uid
      }).then(res => {
        if (res.code === 1) {
          this.userInfo = res.data
        }
      }).catch(err => {
        console.log(err)
      })
    }
  }
}
</script>

<style type="text/css" scoped>
* {
  margin: 0;
  padding: 0;
}

.body {
  background: rgb(250, 249, 247);
  font-family: PingFang SC;
  height: auto;
}

.ChineseName {
  min-height: 50px;
  height: auto;
  line-height: 50px;
  background: rgb(255, 255, 255);
  padding-left: 20px;
}

.Name {
  margin-left: -2px;
  font-size: 15px;
}

.name_title {
  margin-left: 12px;
  border: 0px;
  min-height: 21px;
  height: auto;
  font-size: 15px;
  color: grey;
}

.gray {
  width: 344px;
  height: 1px;
  background: rgba(245, 245, 245, 1);
  opacity: 1;
}
</style>
